<template>

	<view class="work-container">
		<!-- 轮播图 -->
		<view style="width: 98%; border: 1px solid #999; margin: 10rpx auto; border-radius: 20rpx; padding: 10rpx; ">
			<img src="../../../static/images/ssuo.png" alt=""
				style="width: 95%; height: 190rpx; margin: 5rpx; padding-left: 10rpx; display: block;" />
		</view>
		<uni-swiper-dot class="uni-swiper-dot-box" :info="banner" :current="current" field="content">
			<swiper class="swiper-box" :current="swiperDotIndex" @change="changeSwiper" autoplay interval="2000"
				circular>
				<swiper-item v-for="(item, index) in banner" :key="index">
					<view class="swiper-item" @click="clickBannerItem(item)">
						<image :src="item.img" mode="aspectFill" :draggable="false" />
					</view>
				</swiper-item>
			</swiper>
		</uni-swiper-dot>

		<view class="flex" style="height: 500rpx">
			<view class="flex-sub flex">
				<view class="flex-sub flex flex-direction">
					<view class="flex-sub box p-20 m-20 center"
						style="margin-right: 0;margin-bottom: 0;box-shadow: 5px 10px 10px 3px #999;border:1px solid #ccc;"
						@tap="$tab.navigateTo('/pages/demo')">
						<view> <img src="../../../static/images/jiaoc.png" alt=""
								style="width: 50rpx; height: 40rpx;" /></view>
						<view>使用</view>
						<view>教程</view>
						<view>视频</view>
					</view>
					<view class="flex-sub box p-20 m-20 center"
						style="margin-right: 0;box-shadow: 5px 10px 10px 3px #999;border:1px solid #ccc;"
						@tap="gotoconfigwork()">
						<view> <img src="../../../static/images/sblw.png" alt="" style="width: 50rpx; height: 40rpx;" />
						</view>
						<view>设备</view>
						<view>联网</view>
					</view>
				</view>
				<view class="flex-sub flex flex-direction">

					<view class="flex-sub box p-20 m-20 center"
						style="margin-right: 0;margin-bottom: 0;box-shadow: 5px 10px 10px 3px #999;border:1px solid #ccc;">
						<!-- @tap="$tab.navigateTo('/pages/jishuzhidao')" -->
						<button open-type="contact" style="    line-height: initial;
    display: flex;
    flex-direction: column;
    width: max-content;background: #fff;">
							<view> <img src="../../../static/images/jszd.jpg" alt=""
									style="width: 50rpx; height: 40rpx;" /></view>
							<view>技术</view>
							<view>人员</view>
							<view>指导</view>
						</button>
					</view>

					<view class="flex-sub box p-20 m-20 center"
						style="margin-right: 0;box-shadow: 5px 10px 10px 3px #999;border:1px solid #ccc;"
						@tap="$tab.navigateTo('/pages/xuyuanc')">
						<view> <img src="../../../static/images/xyc.png" alt="" style="width: 50rpx; height: 40rpx;" />
						</view>
						<view>功能</view>
						<view>许愿</view>


					</view>
				</view>
			</view>
			<view class="flex-sub box p-20 m-20 center" @tap="$tab.reLaunch('/pages/tabbar/more/more')"
				style="box-shadow: 5px 10px 10px 3px #999;border:1px solid #ccc;">
				<view> <img src="../../../static/images/ty.jpg" alt="" style="width: 50rpx; height: 40rpx;" /> </view>
				<view>相册</view>
				<view>图片</view>
				<view>投影</view>
			</view>
		</view>


		<configNetwork :show="showconfigNetwork" @connectSuccess="connectSuccess()" @close="closeblue()" />


		<uni-popup ref="popup1" title="" backgroundColor="white" :safeArea="false" type="center">


			<view class=" m-20 p-20" style="border-radius: 10rpx;">

				<view class="title600" style="padding-bottom: 15px; text-align: center;"> 请开启以下功能后使用小程序</view>

				<view class=" m-20 p-20" style="display: flex;font-size: 19px;font-weight: 600; margin-left: 56rpx;">
					<view style="padding-left: 0">1.手机蓝牙-----</view>
					<view v-if="isbule" style="color: blue;">已开启</view>
					<view v-else style="color: red;">未开启</view>
				</view>
				<view class=" m-20 p-20" style="display: flex;font-size: 19px;font-weight: 600; margin-left: 56rpx;">
					<view style="padding-left: 0">2.定位位置-----</view>
					<view v-if="islaction" style="color: blue;">已开启</view>
					<view v-else style="color: red;">未开启</view>
				</view>
				<view class="m-20"
					style="display: flex;font-size: 19px;font-weight: 600;justify-content: space-around; margin-top: 50rpx;">
					<view class="titlebor6" @tap="$tab.navigateTo('/pages/webview/webview?type=kqjc')"
						style="margin-right: 65rpx; padding: 18rpx; text-align: center;">开启教程?</view>
					<view class="titlebor6" @click="closepopo()" style="padding: 20rpx; text-align: center;">开始使用</view>
				</view>
			</view>

		</uni-popup>

	</view>
</template>

<script>
	import {
		bannerList
	} from '@/api/api'
	import configNetwork from "@/components/configNetwork.vue";
	export default {
		components: {
			configNetwork
		},
		data() {
			return {
				iswifi: false,
				isbule: false,
				islaction: false,
				showconfigNetwork: false,
				current: 0,
				swiperDotIndex: 0,
				banner: []
			}
		},
		created() {
			this.getBannerList()
		},
		onShow() {
			this.$refs.popup1.open();

			this.checkSystemLocationPermission();

			this.openBluetoothAdapterPermission()
		},
		methods: {

			async checkSystemLocationPermission() {
				// #ifdef APP-PLUS
				let status = await this.checkPermission('location');
				if (status === 1) {
					this.islaction = true;
					console.log('系统定位已开启');
				} else {
					this.islaction = false;
					uni.showModal({
						title: '提示',
						content: '需要开启定位权限',
						success: function(res) {
							if (res.confirm) {
								if (platform.ios) {
									plus.runtime.openURL("app-settings://");
								} else {
									var main = plus.android.runtimeMainActivity();
									var Intent = plus.android.importClass("android.content.Intent");
									var Settings = plus.android.importClass("android.provider.Settings");
									var intent = new Intent(Settings.ACTION_LOCATION_SOURCE_SETTINGS);
									main.startActivity(intent);
								}
							}
						}
					});
				}
				// #endif

				// #ifdef H5 || MP-WEIXIN
				uni.getLocation({
					type: 'gcj02',
					success: (res) => {
						this.islaction = true;
						console.log('系统定位已开启');
					},
					fail: (err) => {
						this.islaction = false;
						uni.showModal({
							title: '提示',
							content: '需要开启定位权限',
							showCancel: false
						});
					}
				});
				// #endif
			},

			// Helper function to check permissions for APP-PLUS
			async checkPermission(permissionID) {
				return new Promise((resolve, reject) => {
					// #ifdef APP-PLUS
					plus.android.requestPermissions(
						[permissionID],
						function(resultObj) {
							var result = 0;
							for (var i = 0; i < resultObj.granted.length; i++) {
								var grantedPermission = resultObj.granted[i];
								if (permissionID === grantedPermission) {
									result = 1;
									break;
								}
							}
							resolve(result);
						},
						function(error) {
							resolve(0);
						}
					);
					// #endif

					// #ifndef APP-PLUS
					resolve(0);
					// #endif
				});
			},
			closepopo() {
				this.$refs.popup1.close();
			},
			checkIsIOS() {
				const systemInfo = uni.getSystemInfoSync();
				return systemInfo.platform === 'ios';
			},
			openBluetoothAdapterPermission() {
				var that = this
				uni.openBluetoothAdapter({
					success: () => {
						// uni.showToast({
						// 	title: '手机蓝牙初始化成功',
						// 	icon: 'success'
						// });
						that.isbule = true
					},
					fail: (err) => {
						if (err.errCode === 10001) {
							uni.showToast({
								title: '请先打开手机蓝牙',
								icon: 'none',
								duration: 5000
							});
						} else {
							uni.showToast({
								title: '请先打开手机蓝牙',
								icon: 'none'
							});
						}
					}
				});
				this.initWifiWithPermission()
			},
			async initWifiWithPermission() {
				var that = this
				// 先请求定位权限
				try {
					// await new Promise((resolve, reject) => {
					// 	uni.authorize({
					// 		scope: 'scope.userLocation',
					// 		success: (res) => {
					// 			that.islaction = true // 移到这里，只有成功才设置状态
					// 			resolve(res);
					// 		},
					// 		fail: (err) => {
					// 			that.islaction = false // 失败时设置为false
					// 			reject(err);
					// 		}
					// 	});
					// });
				} catch (e) {
					// uni.showToast({
					// 	title: '请先授权定位权限',
					// 	icon: 'none',
					// 	duration: 5000
					// });
					//return;
				}

				// 初始化Wi-Fi
				uni.startWifi({
					success: () => {
						that.iswifi = true
						// uni.showToast({
						// 	title: 'Wi-Fi初始化成功',
						// 	icon: 'success'
						// });
					},
					fail: () => {
						// uni.showToast({
						// 	title: '请先打开手机Wi-Fi',
						// 	icon: 'none',
						// 	duration: 5000
						// });
					}
				});
			},
			closeblue() {
				this.showconfigNetwork = false
			},
      connectSuccess() {
        this.showconfigNetwork = false
        uni.switchTab({
          url: '/pages/tabbar/more/more'
        });
      },
			gotoconfigwork() {
				this.showconfigNetwork = true
			},
			getBannerList() {
				bannerList().then(res => {
					this.banner = res.data
					console.log(JSON.stringify(res))
				})
			},
			clickBannerItem(item) {
				console.info(item)
			},
			changeSwiper(e) {
				this.current = e.detail.current
			},
		}
	}
</script>

<style lang="scss">
	.center {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	button::after {
		border: none;
	}

	.titlebor6 {
		border: 2px solid black;
		border-radius: 5px;

		// text-align: center;
		// margin: 10rpx;
	}

	.title600 {}

	.box {
		background: none !important;
	}

	/* #ifndef APP-NVUE */
	page {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		//background-color: #fff;
		min-height: 100%;
		height: auto;
		background-image: url(https://ty.ttxcx.net/static/bg9.jpg);
		background-repeat: no-repeat;
		background-size: 100% 100%;
	}

	view {
		font-size: 31rpx;
		line-height: inherit;

	}


	/* #endif */

	.text {
		text-align: center;
		font-size: 26rpx;
		margin-top: 10rpx;
	}

	.grid-item-box {
		flex: 1;
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 15px 0;
	}

	.uni-margin-wrap {
		width: 690rpx;
		width: 100%;
		;
	}

	.swiper {
		height: 562.5rpx;
	}

	.swiper-box {
		height: 562.5rpx;

	}

	.swiper-item {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		justify-content: center;
		align-items: center;
		color: #fff;
		height: 562.5rpx;
		line-height: 562.5rpx;
		animation: run 10s ease infinite;
	}

	@media screen and (min-width: 500px) {
		.uni-swiper-dot-box {
			width: 400px;
			/* #ifndef APP-NVUE */
			margin: 0 auto;
			/* #endif */
			margin-top: 8px;
		}

		.image {
			width: 100%;
		}
	}
</style>